<!DOCTYPE html>
<html lang="{{.Conf.Lang}}">
<head>
    <meta charset="utf-8">
    <title>{{.Blog.Meta.Title}} | {{.Conf.Title}}</title>
    <meta name="keywords" content="{{range .Blog.Meta.Tags}}{{.}},{{end}}">
    <meta name="description" content="{{.Blog.Meta.Title}}">
    {{template "_head.html" .}}
    <link rel="stylesheet" href="{{.UrlPre}}/static/css/dracula.css">
</head>
<body>

<div id="app">
    <div class="bg-gradient-primary" style="position: sticky; top: 0; z-index: 2333; height: 3px"></div>
    {{template "_topbar.html" .}}

    <div class="container-fluid pl-0 documentation is-dark">
        <div class="row">

            <div class="col-12 col-md-3 sidebar "
            :class="[{'is-hidden': ! sidebar}, {'is-dark': forceDarkSidebar}, {'is-light': forceLightSidebar}]">
                <ul id="sidebar"></ul>
            </div>

            <div class="col-12 col-md-9 article" :class="{'expanded': ! sidebar}">
                <a href="{{.UrlPre}}/{{.Blog.Archive.Url}}">
                    <h1 class="post-title">{{.Blog.Meta.Title}}</h1>
                </a>

                <p class="post-meta">
                    {{if .Blog.Meta.Author}}
                        <img width="32" height="32" alt="{{.Blog.Author.ID}}" class="post-avatar" src="{{.UrlPre}}/{{.Blog.Author.Avatar}}">
                        <a class="post-author" href="#">{{.Blog.Author.Name}}</a>
                    {{end}}
                    at <a class="post-date" href="#">{{.Blog.Meta.Date}}</a>
                    under
                    {{$urlpre := .UrlPre}}
                    <span class="tags">{{range $tag := .Blog.Meta.Tags}}
                        <a class="post-tag" href="{{$urlpre}}/tag/{{$tag}}.html">{{$tag}}</a>
                    {{end}}</span>
                </p>

                <hr>
                {{.Blog.Content}}
                <hr>
            </div>

        </div>
    </div>

    <larecipe-back-to-top></larecipe-back-to-top>
</div>

<script src="{{.UrlPre}}/static/js/bundle.js"></script>
<script src="{{.UrlPre}}/static/js/app.js"></script>
<script src="{{.UrlPre}}/static/js/highlight.js"></script>
<script type="text/javascript">
    loadSidebar('{{.UrlPre}}');
    hljs.initHighlightingOnLoad();
</script>
</body>
</html>
